{% extends "base.html" %}
{% block title %}Gallery{% endblock %}
{% block script %}
<script src="/statics/js/jquery.gallery.js"></script>
<link rel="stylesheet" type="text/css" href="/statics/css/gallery.css"/>
<link rel="stylesheet" type="text/css" href="/statics/css/gallery-effect.css"/>
 <script type="text/javascript">
$(document).ready(function(){
    $('#gallery').gallerie();
});

</script>
{% endblock %}
{% block wrap_id%}_gallery{% endblock %}
{% block userinfo %}
{% if user %}
<p id="user-info">
    <strong>{{ user.user_nickname }}</strong>, Welcome to Tuna Crew<br/>
    <a href="/change_pwd/">Change Password</a><br/>
    <a href="/logout/">Logout</a>
</p>    
{% endif %}
{% endblock %}
{% block menu_gallery %}id="current"{% endblock %}
{% block contentwrap_id%})_gallery{% endblock %}
{% block content %}
	<div id="main-noside">
	    <h2><a href="/gallery/">TuncaCrew Gallery</a><a href="/gallery/post/"><input type="button" style="float:right; width:100px; margin-top:10px;" value="Post" /></a></h2>
	    {% for gallery in gallery_list %}
	    {% endfor %}
	    <div id="gallery">
	    {% if gallery_list %}
	    {% for gallery in gallery_list %}
		<a href="/gallery/serve/{{ gallery.image_key }}"><img src="/gallery/serve/{{ gallery.image_key }}thum"/></a>
		{% endfor %}
        {% else %}
            <p>
                Gallery is empty.
            </p>
        {% endif %}
		</div>
		<span text-align="center">
		[&nbsp;&nbsp;
		{% if page_list %}
		  {% for page_num in page_list %}
		      {% if page_num == cur_page %}
		      <a href="/gallery/?page={{page_num}}"><strong>{{ page_num }}</strong></a>&nbsp;&nbsp;
		      {% else %}
		      <a href="/gallery/?page={{page_num}}">{{ page_num }}</a>&nbsp;&nbsp;
		      {% endif %}
		  {% endfor %}
		{% else %}
		  <a href="/gallery/?page=1"><strong>1</strong></a>&nbsp;&nbsp;
		{% endif %}
		]
		</span>
	<!-- main ends -->  
	</div>
{% endblock %}